<table class="table table-bordered table-mobile table-layout-fixed">
  <colgroup>
    <col class="col-sm-4">
    <col class="col-sm-3">
  </colgroup>
  <thead>
    <tr>
      <th>{{customNameHeader || 'Name'}}</th>
      <th>Status</th>
      <th>Containers Ready</th>
      <th>Container Restarts</th>
      <th>Age</th>
      <th ng-if="activePods">Receiving Traffic</th>
    </tr>
  </thead>
  <tbody ng-if="!sortedPods.length">
    <tr><td colspan="{{activePods ? 6 : 5}}"><em>{{emptyMessage || 'No pods to show'}}</em></td></tr>
  </tbody>
  <tbody ng-if="sortedPods.length">
    <tr ng-repeat="pod in sortedPods track by (pod | uid)" class="animate-repeat">
      <td data-title="{{customNameHeader || 'Name'}}">
        <a href="{{pod | navigateResourceURL}}">{{pod.metadata.name}}</a>
        <span ng-if="pod | isDebugPod">
          <i class="fa fa-bug info-popover"
             aria-hidden="true"
             data-toggle="popover"
             data-trigger="hover"
             dynamic-content="Debugging pod {{pod | debugPodSourceName}}"></i>
           <span class="sr-only">Debugging pod {{pod | debugPodSourceName}}</span>
        </span>
      </td>
      <td data-title="Status">
        <div row class="status">
          <status-icon status="pod | podStatus" disable-animation></status-icon>
          <span flex>{{pod | podStatus | humanizePodStatus}}</span>
        </div>
      </td>
      <td data-title="Ready">{{pod | numContainersReady}}/{{pod.spec.containers.length}}</td>
      <td data-title="Restarts">{{pod | numContainerRestarts}}</td>
      <td data-title="Age"><span am-time-ago="pod.metadata.creationTimestamp" am-without-suffix="true"></span></td>
      <td ng-if="activePods" data-title="Receiving Traffic">
        <span ng-if="activePods[pod.metadata.name]">
          <span class="fa fa-fw fa-check text-success" aria-hidden="true"></span>
          <span class="sr-only">Yes</span>
        </span>
        <span ng-if="!activePods[pod.metadata.name]">
           <span data-toggle="popover" data-trigger="hover" data-content="{{podFailureReasons[pod.status.phase] || 'This pod has no endpoints and is not accepting traffic.'}}" style="cursor: help;">
            <span class="fa fa-fw fa-times text-danger" aria-hidden="true" data-toggle="tooltip" style="cursor: help;"></span>
            <span class="sr-only">No</span>
          </span>
        </span>
      </td>
    </tr>
  </tbody>
</table>
